<!DOCTYPE html>
<html lang="en"  xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <link rel="shortcut icon"  th:href="@{/chqimage/favicon.ico}" type="image/x-icon">
    <title>我的调解</title>
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <link rel="stylesheet" th:href="@{/m-css/m-mymediate.css}">
    <script type="text/javascript" th:src="@{/chqjs/jquery.min.js}"></script>
    <script type="text/javascript" th:src="@{/chqjs/vue.min.js}"></script>
</head>
<body>
    <!--顶部标题-->
    <div id="head">
        <a href="m-personal.html" class="return_img float_left"><img src="/m-image/icon-fanhui.png" alt=""></a>
        <p class="head_title">我的调解</p>
    </div>
    <div id="mm_box">
        <!--调解状态-->
        <ul class="mm_stateList">
            <li  class="mm_state"  @click="changeState(0)" :class="{'state_active':state_num == '0'}">
                <span>待受理</span>
                <img src="/m-image/hengx.png" alt="" class="hengx_img" v-if="state_num == '0'">
            </li>
            <li class="mm_state" id="state1" @click="changeState(1)" :class="{'state_active':state_num == '1'}">
                <span>正在调解</span>
                <img src="/m-image/hengx.png" alt="" class="hengx_img"  v-if="state_num == '1'">
            </li>
            <li class="mm_state" id="state2" @click="changeState(2)" :class="{'state_active':state_num == '2'}">
                <span>历史调解</span>
                <img src="/m-image/hengx.png" alt="" class="hengx_img"  v-if="state_num == '2'">
            </li>
        </ul>
        <!--事件-->
        <!--待受理-->
        <ul class="case_list" v-if="state_num == '0'">
            <li class="case"  v-for="caseReady in caseReadyList" @click="caseInfo(caseReady.case_id,caseReady.case_state)">
                <div class="case_title">
                    <span class="float_left title">{{caseReady.type_name}}</span><span class="float_right time">{{caseReady.create_date}}</span>
                </div>
                <div class="case_content">{{caseReady.details}}</div>
                <div class="case_other">
                    <div class="fayuan float_left">{{caseReady.court}}</div>
                    <div class="zhuangtai float_left">{{caseReady.case_state}}</div>
                </div>
            </li>
        </ul>
        <!--正在调解-->
        <ul class="case_list" v-if="state_num == '1'">
            <li class="case"   v-for="caseBeing in caseBeingList" @click="caseInfo(caseBeing.case_id,caseBeing.case_state)">
                <div class="case_title">
                    <span class="float_left title">{{caseBeing.type_name}}</span><span class="float_right time">{{caseBeing.create_date}}</span>
                </div>
                <div class="case_content">{{caseBeing.details}}</div>
                <div class="case_other">
                    <div class="fayuan float_left">{{caseBeing.court}}</div>
                    <div class="zhuangtai float_left">{{caseBeing.case_state}}</div>
                    <div class="diary float_right">记录调解日志</div>
                </div>
            </li>
        </ul>
        <!--历史调解-->
        <ul class="case_list" v-if="state_num == '2'">
            <li class="case"   v-for="caseFinish in caseFinishList" @click="caseInfo(caseFinish.case_id,caseFinish.case_state)">
                <div class="case_title">
                    <span class="float_left title">{{caseFinish.type_name}}</span><span class="float_right time">{{caseFinish.create_date}}</span>
                </div>
                <div class="case_content">{{caseFinish.details}}</div>
                <div class="case_other">
                    <div class="fayuan float_left">{{caseFinish.court}}</div>
                    <div class="zhuangtai float_left">{{caseFinish.case_state}}</div>
                    <div class="pingjia float_right"  @click.self="showPingjia(caseFinish.case_id,caseFinish.judged_state)">{{caseFinish.judged_state}}</div>
                </div>
            </li>
        </ul>
    </div>

    <script>
        new Vue({
            el:'#mm_box',
            data:{
                caseReadyList:[],
                caseBeingList:[],
                caseFinishList:[],
                state_num:''
            },
            mounted:function () {
                //获取URL参数，即 当前案件调解状态
                var location = window.location.href;
                var href= location+"";
                var href_part=href.split('?');
                this.state_num=(href_part[1])*1;
                var _that = this;
                $.ajax({
                    url:'/mediator/mediatorCaseInfo',
                    type:'get',
                    datatype:'json',
                    success:function (result) {
                        result.forEach(function (obj,i) {
                            if(obj.judged_state == 0){
                                obj.judged_state = '未评价';
                            }
                            if(obj.judged_state == 1){
                                obj.judged_state = '查看评价';
                            }
                            if (obj.case_state != 0) {
                                if (obj.case_state == 1) {
                                    obj.case_state = '正在调解';
                                    _that.caseBeingList.push(obj);
                                } else if (obj.case_state == 2) {
                                    obj.case_state = '调解成功';
                                    _that.caseFinishList.push(obj);
                                } else {
                                    obj.case_state = '调解失败';
                                    _that.caseFinishList.push(obj);
                                }
                            } else {
                                obj.case_state = '待受理';
                                _that.caseReadyList.push(obj);
                            }
                        });
                    },
                    error:function (err) {
                        console.log(err);
                    }
                });
            },
            methods:{
                changeState:function (case_num) {
                    this.state_num = case_num;
                },
                caseInfo:function (case_id,case_state) {
                    $.ajax({
                        url:'/mediator/case_page?case_id='+case_id,
                        type:'get',
                        success:function (result) {
                            if(case_state == '待受理'){
                                window.location.href = '/mediator/to_apply?'+case_id;
                            }else if(case_state == '正在调解'){
                                window.location.href = '/mediator/to_detail?'+case_id;
                            }else{
                                window.location.href = '/mediator/to_result?'+case_id;
                            }
                        },
                        error:function (err) {
                            console.log(err);
                        }

                    })
                },
                showPingjia:function (case_id,judged_state) {
                    if(judged_state == '已评价'){
                        $.ajax({
                            url:'oneCase?case_id='+case_id,
                            type:'get',
                            success:function (result) {
                                window.location.href = '';
                            },
                            error:function (err) {
                                console.log(err);
                            }
                        })
                    }else{
                        return false;
                    }
                }
            }
        })
    </script>
</body>

</html>